<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <link href="${pageContext.request.contextPath}/css/common.css" rel="stylesheet" type="text/css"/>
    <link href="${pageContext.request.contextPath}/css/style.css" rel="stylesheet" type="text/css"/>
</head>

<style>
    .auction-row {
    display: flex;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    transition: background-color 0.3s ease;
    }

    .auction-row:hover {
    background-color: #f9f9f9;
    }

    .col-name {
    flex: 2;
    font-weight: bold;
    }

    .col-desc, .col-time, .col-price {
    flex: 3;
    color: #555;
    }

    .col-action {
    flex: 1;
    text-align: center;
    }

    .col-action a {
    color: #d32f2f;
    text-decoration: none;
    font-weight: bold;
    }

    .col-action a:hover {
    text-decoration: underline;
    }

</style>

<body>
<div class="wrap">
    <div class="sale">
        <h1 class="lf">在线拍卖系统</h1>
        <div class="logout right"><a href="#" title="注销">注销</a></div>
    </div>
    <div class="forms">
        <label for="name">名称</label>
        <input name="" type="text" class="nwinput" id="name"/>
        <label for="names">描述</label>
        <input name="" type="text" id="names" class="nwinput"/>
        <label for="time">开始时间</label>
        <input name="" type="text" id="time" class="nwinput"/>
        <label for="end-time">结束时间</label>
        <input name="" type="text" id="end-time" class="nwinput"/>
        <label for="price">起拍价</label>
        <input name="" type="text" id="price" class="nwinput"/>
        <input name="" type="button" value="查询" class="spbg buttombg f14  sale-buttom"/>
    </div>
    <div class="items">
        <ul class="rows even strong">
            <li>名称</li>
            <li class="list-wd">描述</li>
            <li>开始时间</li>
            <li>结束时间</li>
            <li>起拍价</li>
            <li class="borderno">操作</li>
        </ul>

        <c:forEach items="${auctionList}" var="user">
            <ul class="rows even auction-row">
                <li class="col-name">${user.auctionName}</li>
                <li class="col-desc">${user.auctionDesc}</li>
                <li class="col-time">${user.auctionStartTime}</li>
                <li class="col-time">${user.auctionEndTime}</li>
                <li class="col-price">${user.auctionUpset}</li>
                <li class="col-action borderno red"><a href="#">竞拍</a></li>
            </ul>
        </c:forEach>


        <div class="page">
            <a href="#" title="">首页</a>
            <a href="#" title="">上一页</a>
            <span class="red">前5页</span>
            <a href="#" title="">1</a>
            <a href="#" title="">2</a>
            <a href="#" title="">3</a>
            <a href="#" title="">4</a>
            <a href="#" title="">5</a>
            <a href="#" title="">下一页</a>
            <a href="#" title="">尾页</a>
        </div>
    </div>
    <!-- main end-->
</div>
</body>
</html>